import * as echarts from "echarts";

// 威胁类型颜色配置
export const getThreatTypeColor = (key: string) => {
  const colors = {
    sql_injection: "#FF6B6B",
    command_injection: "#4ECDC4",
    code_execution: "#45B7D1",
    deserialization: "#96CEB4",
    file_upload: "#FFEAA7",
    file_inclusion: "#DDA0DD",
    ssrf: "#98D8C8",
    xxe: "#F7DC6F",
    template_injection: "#BB8FCE",
    xss: "#85C1E9",
    authentication_bypass: "#F8C471",
    information_disclosure: "#82E0AA",
    api_vulnerability: "#E74C3C",
    command_execution: "#9B59B6",
    credential_exposure: "#F39C12",
    misconfiguration: "#1ABC9C",
    privilege_escalation: "#E67E22",
    rce: "#34495E",
    ssti: "#8E44AD",
    webshell: "#D35400",
  };
  return colors[key as keyof typeof colors] || "#95A5A6";
};

// 攻击分类颜色配置
export const getCategoryColor = (index: number) => {
  const colors = [
    "#FF6B6B",
    "#4ECDC4",
    "#45B7D1",
    "#96CEB4",
    "#FFEAA7",
    "#DDA0DD",
    "#98D8C8",
    "#F7DC6F",
    "#BB8FCE",
    "#85C1E9",
    "#F8C471",
    "#82E0AA",
  ];
  return colors[index % colors.length];
};

// 严重程度颜色配置
export const getSeverityColor = (key: string) => {
  const colors = {
    critical: "#FF4757",
    high: "#FF6B35",
    medium: "#F7931E",
    low: "#2ED573",
  };
  return colors[key as keyof typeof colors] || "#95A5A6";
};

// 饼图基础配置
export const createPieChartOption = (
  data: any[],
  title: string,
  colors: (item: any) => string
) => {
  const validData = data.filter((item) => item && item.name && item.value > 0);

  return {
    tooltip: {
      trigger: "item",
      formatter: "{a} <br/>{b}: {c} ({d}%)",
      z: 50000,
    },
    legend: {
      orient: "vertical",
      right: "5%",
      top: "center",
      width: "35%",
      height: "80%",
      itemWidth: 12,
      itemHeight: 8,
      textStyle: {
        fontSize: 10,
      },
      data:
        validData.length > 0
          ? validData.map((item) => item.name)
          : ["暂无数据"],
      // 启用分页功能
      type: "scroll",
      pageButtonItemGap: 5,
      pageButtonGap: 10,
      pageButtonPosition: "end",
      pageIconColor: "#409EFF",
      pageIconInactiveColor: "#C0C4CC",
      pageIconSize: 12,
      pageTextStyle: {
        color: "#666",
        fontSize: 10,
      },
    },
    series: [
      {
        name: title,
        type: "pie",
        radius: ["40%", "60%"],
        center: ["35%", "50%"],
        avoidLabelOverlap: false,
        label: {
          show: false,
          position: "center",
        },
        emphasis: {
          label: {
            show: true,
            fontSize: "16",
            fontWeight: "bold",
          },
        },
        labelLine: {
          show: false,
        },
        data:
          validData.length > 0
            ? validData.map((item) => ({
                value: item.value || 0,
                name: item.name || "未知",
                itemStyle: {
                  color: colors(item),
                },
              }))
            : [
                {
                  value: 1,
                  name: "暂无数据",
                  itemStyle: { color: "#f0f0f0" },
                },
              ],
      },
    ],
  };
};

// 环形图基础配置
export const createRingChartOption = (
  data: any[],
  title: string,
  colors: (item: any) => string
) => {
  const validData = data.filter((item) => item && item.name && item.value > 0);

  return {
    tooltip: {
      trigger: "item",
      formatter: "{a} <br/>{b}: {c} ({d}%)",
      z: 50000,
    },
    legend: {
      orient: "vertical",
      right: "5%",
      top: "center",
      width: "35%",
      height: "80%",
      itemWidth: 12,
      itemHeight: 8,
      textStyle: {
        fontSize: 10,
      },
      data:
        validData.length > 0
          ? validData.map((item) => item.name)
          : ["暂无数据"],
      // 启用分页功能
      type: "scroll",
      pageButtonItemGap: 5,
      pageButtonGap: 10,
      pageButtonPosition: "end",
      pageIconColor: "#409EFF",
      pageIconInactiveColor: "#C0C4CC",
      pageIconSize: 12,
      pageTextStyle: {
        color: "#666",
        fontSize: 10,
      },
    },
    series: [
      {
        name: title,
        type: "pie",
        radius: ["30%", "50%"],
        center: ["35%", "50%"],
        avoidLabelOverlap: false,
        label: {
          show: false,
          position: "center",
        },
        emphasis: {
          label: {
            show: true,
            fontSize: "16",
            fontWeight: "bold",
          },
        },
        labelLine: {
          show: false,
        },
        data:
          validData.length > 0
            ? validData.map((item) => ({
                value: item.value || 0,
                name: item.name || "未知",
                itemStyle: {
                  color: colors(item),
                },
              }))
            : [
                {
                  value: 1,
                  name: "暂无数据",
                  itemStyle: { color: "#f0f0f0" },
                },
              ],
      },
    ],
  };
};

// 柱状图基础配置
export const createBarChartOption = (
  data: any[],
  title: string,
  colors: (item: any, index: number) => string
) => {
  const validData = data.filter((item) => item && item.name && item.value > 0);

  return {
    tooltip: {
      trigger: "axis",
      axisPointer: {
        type: "shadow",
      },
      z: 50000,
    },
    grid: {
      left: "3%",
      right: "4%",
      bottom: "3%",
      containLabel: true,
    },
    xAxis: {
      type: "category",
      data:
        validData.length > 0
          ? validData.map((item) => item.name)
          : ["暂无数据"],
      axisLabel: {
        rotate: 45,
        fontSize: 10,
      },
    },
    yAxis: {
      type: "value",
    },
    series: [
      {
        name: title,
        type: "bar",
        barWidth: "60%",
        data:
          validData.length > 0
            ? validData.map((item, index) => ({
                value: item.value || 0,
                itemStyle: {
                  color: colors(item, index),
                },
              }))
            : [{ value: 1, itemStyle: { color: "#f0f0f0" } }],
      },
    ],
  };
};

// 图表渲染工具函数
export const renderChart = (
  chartInstance: echarts.ECharts | undefined,
  option: any
) => {
  if (!chartInstance) return;

  try {
    chartInstance.clear();
    chartInstance.setOption(option || {});
    setTimeout(() => {
      chartInstance.resize();
    }, 100);
  } catch (error) {
    console.error("图表渲染失败:", error);
  }
};

// 窗口大小改变时重新渲染图表
export const handleChartResize = (charts: (echarts.ECharts | undefined)[]) => {
  charts.forEach((chart) => {
    if (chart) {
      chart.resize();
    }
  });
};
